<template>
  <div class="fileList">
    <van-collapse v-model="activeNames" accordion>
      <van-collapse-item label-class="ss" :title="item.name" :name="item.id" v-for="(item, index) in file_types" :key="index">
        <van-cell :title="curr.name" title-class="cell-title" is-link v-for="(curr, index) in item._child" :key="index" @click="getTabId(item.id, item.name, curr.name, 0)"/>
      </van-collapse-item>
      <van-collapse-item title="产品图库" name="1">
        <div v-for="(item, index) in product_types" :key="index">
          <van-cell :title="curr.name" title-class="cell-title" is-link v-for="(curr, index) in item" :key="index" @click="getTabId(curr.id, '产品图库', curr.name, 1)"/>
        </div>
      </van-collapse-item>
    </van-collapse>
  </div>
</template>

<script>
  export default {
    props: {
      file_types: {
        type: Array,
        required: true,
        default: function() {
          return []
        }
      },
      product_types: {
        type: Array,
        required: true,
        default: function() {
          return []
        }
      },
    },
    data() {
      return {
        activeNames: ['0']
      }
    },
    methods: {
      getTabId(id, typeName, productName, difference) {
        this.$emit('getId', {
          id: id,
          name: typeName,
          productName: productName,
          difference: difference
        })
      }
    },
  }
</script>
<style scoped>
  .fileList >>> .van-collapse-item__content{
    padding: 0;
  }
</style>
<style lang="less" scoped>
  .fileList {
    padding-bottom: 0.72rem;
    .cell-title{
      color: #969799;
    }
  }
</style>
